<template>
  <div class="pilot-head">
     <div class="data">
      <ul>
        <li>
          <a href="">
            <p>总阅读量</p>
            <p style="font-size: large; font-weight: bolder;">0</p>
            <p>昨日无变化</p>
          </a>
        </li>
        <li>
          <a href=" javascript:;">
            <p>累计收益</p>
            <p style="font-size: large; font-weight: bolder;">0</p>
            <p>昨日无变化</p>
          </a>
        </li>
        <li>
          <a href="">
            <p>粉丝数</p>
            <p style="font-size: large; font-weight: bolder;">0</p>
            <p>昨日无变化</p>
          </a>
        </li>
        <li>
          <a href="">
            <p>收藏数</p>
            <p style="font-size: large; font-weight: bolder;">0</p>
            <p>昨日无变化</p>
          </a>
        </li>
      </ul>
    


     </div>
     <div class="Recent-article">
        <div class="changer">
          <ul>
            <li><router-link :to="{name:'近期文章'}">近期文章</router-link></li>
            <li><router-link :to="{name:'最近上传'}">最近上传</router-link></li>
            <li><router-link :to="{name:'内容管理'}" style="float: right;font-size: small;">查看更多</router-link></li>
          </ul>

        </div>

        <router-view></router-view>
       



     </div>


  </div>
</template>

<script>
export default {
     name:"PilotHead"
}
</script>

<style>
  .pilot-head{
        position: absolute;
        width: 1200px;
        height: 600px;
        top: 80px;
        /* background-color: black; */
        left: 300px;
        /* border: 1px solid black; */
    }
    .pilot-head .data{
      /* position: relative; */
      width: 100%;
      height: 100px;
      top:80px;
    }
    .pilot-head .data ul{
      list-style-type: none;
      text-align: center;
      margin-right: 80px;
      margin-top: 20px;
    }
    .pilot-head .data ul li{
      /* display: inline;
      margin-left: 160px; */
    }
    .pilot-head .data ul li a{
       display: inline;
       width: 80px;
       height: 80px;
       float: left;
       margin-left: 160px;
       text-decoration: none;
       color: #000;

    }
    .pilot-head .data ul li a p{
      font-size: small;
      margin-top: 12px;
    }
    .pilot-head .Recent-article{
         width: 100%;
         height: 500px;
    }
    .pilot-head .Recent-article .changer{
      margin-top: 80px;
      margin-right: 250px;

    }
    .pilot-head .Recent-article .changer ul{
      list-style-type: none;
    }
    .pilot-head .Recent-article .changer ul li{
      display: inline;
    }
    .pilot-head .Recent-article .changer ul li a{
      text-decoration: none;
      color: #000;
      margin-left: 20px;
    }
 
  
  
</style>